<clr-modal [(clrModalOpen)]="modalOpened" [clrModalSize]="'xl'">
  <h3 class="modal-title">Pod列表</h3>
  <div class="modal-body">
    <hr>
    <clr-datagrid>
      <clr-dg-placeholder>暂无数据！</clr-dg-placeholder>
      <clr-dg-column>
        <ng-container *clrDgHideableColumn="{hidden: false}">
          名称
        </ng-container>
      </clr-dg-column>
      <clr-dg-column [clrDgSortBy]="stateComparator">
        <ng-container *clrDgHideableColumn="{hidden: false}">
          状态
        </ng-container>
      </clr-dg-column>
      <clr-dg-column>
        <ng-container *clrDgHideableColumn="{hidden: false}">
          PODIP
        </ng-container>
      </clr-dg-column>
      <clr-dg-column>
        <ng-container *clrDgHideableColumn="{hidden: false}">
          重启次数
        </ng-container>
      </clr-dg-column>
      <clr-dg-column [clrDgSortBy]="timeComparator" [(clrDgSortOrder)]="sortOrder">
        <ng-container *clrDgHideableColumn="{hidden: false}">
          Age
        </ng-container>
      </clr-dg-column>
      <clr-dg-column>
        <ng-container *clrDgHideableColumn="{hidden: false}">
         操作
        </ng-container>
      </clr-dg-column>
      <clr-dg-row *clrDgItems="let pod of pods">
        <clr-dg-cell class="copy">{{pod.name}}</clr-dg-cell>
        <clr-dg-cell>
          <span class="label label-light-blue">{{pod.state}}</span>
        </clr-dg-cell>
        <clr-dg-cell>{{pod.podIp}}</clr-dg-cell>
        <clr-dg-cell>
          <span *ngFor="let state of pod.containerStatus"
                class="label label-light-blue">{{state.name}}:{{state.restartCount}}
          </span>
        </clr-dg-cell>
        <clr-dg-cell>{{pod.startTime | relativeTime}}</clr-dg-cell>
        <clr-dg-cell>
          <button class="wayne-button text" (click)="enterContainer(pod)">进入容器</button>
          <button class="wayne-button text" (click)="podLog(pod)">日志</button>
          <button class="wayne-button text" (click)="deletePod(pod)">删除</button>
        </clr-dg-cell>
      </clr-dg-row>
      <clr-dg-footer>
        {{pagination.firstItem + 1}} - {{pagination.lastItem + 1}}
        of {{pagination.totalItems}}
        <clr-dg-pagination #pagination [clrDgPageSize]="10"></clr-dg-pagination>
      </clr-dg-footer>
    </clr-datagrid>
  </div>
</clr-modal>

